<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">

<h:head>
</h:head>
<h:body>

	<h:form>
        <p:growl id="growl" showDetail="true" life="3000"/>
        
		<h:panelGrid columns="3">
			<h:outputLabel for="username" value="User name:*" />
			<p:inputText id="username" value="#{loginBean.userName}" required="true">
				<f:validateLength minimum="2" />
			</p:inputText>
			<p:message for="username" />
			
			<h:outputLabel for="password" value="Password:*" />
			<p:password id="password" value="#{loginBean.password}" required="true"/>
			<p:message for="password" />
           
            <p:selectBooleanCheckbox value="#{loginBean.remember}" />
            <h:outputText value="Remember me " />  
            <h:outputText value="" /> 
		
		    
		    <f:facet name="footer">
		    <!--  <h:outputText value="" />  -->
 			<p:commandButton id="loginButton" update="growl" value="Login" actionListener="#{loginBean.login}" 
 			    oncomplete="handleLoginRequest(xhr,status,args)" ajax="false"></p:commandButton>
 			<!-- <h:outputText value="" />  -->
 			</f:facet>
			
			<h:outputText value="" /> 
			<p:commandLink id="remind" actionListener="#{loginBean.remind}" style="margin-right:20px;" ajax="false">  
                <h:outputText value="Forgot password" />  
            </p:commandLink>
            
            <p:commandLink id="register" actionListener="#{loginBean.register}" style="margin-right:20px;" ajax="false">  
                <h:outputText value="Create an account" />  
            </p:commandLink>       

		</h:panelGrid>

	</h:form>
	
	<script type="text/javascript"> 
	   function handleLoginRequest(xhr,status,args){
		   if (args.validationFailed|| !args.loggedIn){
			   PF('dlg').jq.effect("shake",{times:5},100);
		   } else {
			   PF('dlg').hide();
			   $('#loginButton').fadeOut();
		   }
			   
	   }
	</script> 
	

</h:body>
</html>